import React, { useState, useEffect } from 'react'
import { Button, Form, Modal, message, Select } from 'antd'
import api from '../../../api/activityManage'

const { Option } = Select

const EditChannelModal = ({actId,showModal,importModal,showImportModal,form}) => {
    const [state, setState] = useState({
		btnLoading:false,//按钮loading
		roleArr:[],//员工角色下拉框
	});

    //更新state
    const updateState = (newState) => {
        let data = JSON.parse(JSON.stringify(state))
        setState(Object.assign({}, data, newState))
    }

	useEffect(()=>{
		//获取员工角色下拉框
		api.getRoleList({status:1},(res)=>{
			updateState({
				roleArr:res
			})
		})
	},[])

    const handleSubmit = (e) => {
        e.preventDefault();
        form.validateFields((err, values) => {
			if (!err) {
				updateState({btnLoading:true})
				console.log(values)
				let obj = Object.assign({},{actId:actId},values)
				api.addByRoleName(obj,(res)=>{
					if(res){
						message.success('批量生成成功！')
						showModal(4,{})
						form.resetFields()
					}
					updateState({btnLoading:false})
				})
            }
        });
    }
    //关闭模态框
    const closeModal = ()=>{
		showImportModal(false)
		form.resetFields()
	}
    const { getFieldDecorator } = form;
    return (
            <Modal title="批量生成员工渠道"
				visible={importModal}
				footer={null}
				onCancel={closeModal}
			>
                <Form labelCol={{ span: 8 }} wrapperCol={{ span: 16 }} onSubmit={handleSubmit}>
					<Form.Item label="员工角色">
						{getFieldDecorator('roleName', {
							// initialValue:editModal.data.roleName,
							rules: [{ required: true, message: '请选择员工角色' }],
						})(
							<Select style={{ width: 200 }} allowClear showSearch>
								{state.roleArr.map((v,i)=>{
									return (
										<Option key={i} value={v.name}>{v.name}</Option>
									)
								})}
							</Select>
						)}
					</Form.Item>
					<Form.Item wrapperCol={{ span: 24 }} style={{textAlign:'right'}}>
						<Button onClick={closeModal}>取消</Button>
						<Button style={{marginLeft:30}} type="primary" htmlType="submit" loading={state.btnLoading}>生成渠道</Button>
					</Form.Item>
                </Form>
            </Modal>
    )
}

export default Form.create({})(EditChannelModal)